<template>
    <div id="Qrzb">
        <div class="tanchuang">
            <p class="tishi">提示信息</p>
            <p class="zz">转账给{{userphonenum}}</p>
            <p class="bi_num">{{bizhong}} {{shuliang}}个</p>
            <div class="bottom">
                <div class="quxiao" @click="showquxiao" :class="isqx?'active':'quxiao'">取消</div>
                <div class="queren" @click="showqueren" :class="isqr?'active':'queren'">确认</div>
            </div>
        </div>
    </div>
</template>

<script>
    import Vue from "vue";
    import Router from "vue-router";
    Vue.use(Router);
    export default {
        name: 'qrzb',
        data() {
            return {
                userphonenum:"13000000000",
                bizhong:"MUT",
                shuliang:"782.3721",
                isqx:false,
                isqr:true
            }
        },
        methods: {
            showquxiao() {
                this.isqx = true;
                this.isqr = false
            },
            showqueren() {
                this.isqx = false;
                this.isqr = true
            }
        }
    }
</script>

<style scoped lang="stylus">
@import '../../common/styl/mixin'
    #Qrzb
        margin  0
        width  rem(375)
        min-height  100vh
        background #000000
        opacity 0.5
        position relative
        .tanchuang
            width rem(240)
            height rem(171)
            border-radius rem(13)
            position fixed
            top rem(262)
            left rem(67)
            background #FAFAFA
            display flex
            flex-direction column
            align-items center
            z-index 10
            .tishi
                margin-top rem(20)
                font-family HiraginoSansGB-W3
                font-size rem(17)
                font-weight W3
                color #333333
            .zz,.bi_num
                font-family HiraginoSansGB-W3
                font-size rem(15)
                font-weight W3
                color #666666
            .zz
                margin-top rem(29)
            .bi_num
                margin-top rem(9)
            .bottom
                width 100%
                display flex
                div
                    width 50%
                    height rem(45)
                    box-sizing border-box
                    border-top rem(1) solid #E5E5E5
                    font-family HiraginoSansGB-W3
                    font-size rem(15)
                    font-weight W3
                    color #999999
                    line-height rem(45)
                    text-align center
                    margin-top rem(22)
                div.quxiao
                    border-right rem(1) solid #E5E5E5
                div.active
                    color #304C7D
</style>
